<%--
  Created by IntelliJ IDEA.
  User: GZ
  Date: 2021/7/8
  Time: 20:20
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>创建视频分类</title>
    <script src="/js/jquery/jquery-3.3.1.js"></script>
    <script>
     function changeSelectState(state)
     {
         if(0==state)
         {
             $('#p-type-select').prop({disabled:true});
         }
         else if(1==state){
             $('#p-type-select').prop({disabled:false});
         }
         else{
             alert('参数错误');
         }
     }

     $(function(){

         $.ajax({
             url:'/sort/load_by_level',
             type:'get',
             data:{level:1},
             dataType:'json',
             success:function(jsonData){
                 var len=jsonData.length;
                 for(var index=0;index<len;index++){
                     var sort=jsonData[index];
                     var id=sort.id;
                     var type=sort.type;
                     //构建一个option选项
                     var optionHTML='<option value="'+id+'">'+type+'</option>';
                     $('#p-type-select').append(optionHTML);
                 }
             },
             error:function(){
                 alert('加载视频一级分类数据失败!!!');
             }

         });

     });
    </script>
</head>
<body>
   <form action="/sort/create" method="post">
       <ul style="list-style: none">
           <li><h3>创建视频分类</h3></li>
           <li><span>分类名称:</span><input type="text" name="type"></li>
           <li><span>分类等级:</span>
               <label><input type="radio" name="level" value="1" onclick="changeSelectState(0)" checked >一级分类</label>
               <label><input type="radio" name="level" value="2" onclick="changeSelectState(1)">二级分类</label>
           </li>
           <li><span>所属父分类:</span>
               <select id="p-type-select" name="pId" disabled>
                   <option  disabled>----所属一级分类---</option>
               </select>
           </li>
           <li>
               <button>创建分类</button>
               <button type="reset">重新填写</button>
           </li>
       </ul>
   </form>
</body>
</html>
